<template>
  <div class="searchBack" v-if="!$route.query.staffCode">
    <div class="tip">查询背调信息</div>

    <el-form
      label-width="140px"
      :model="ruleForm"
      ref="ruleForm"
      label-position="right"
    >
      <el-form-item label="员工姓名：" class="name" prop="realName">
        <el-input
          v-model="ruleForm.realName"
          size="small"
          placeholder="请输入员工姓名"
          maxlength="15"
          show-word-limit
        ></el-input>
      </el-form-item>
      <el-form-item label="员工身份证号码：" class="idNo">
        <el-input
          v-model="ruleForm.idCordNo"
          size="small"
          placeholder="请输入员工身份证号码"
          maxlength="18"
          show-word-limit
        ></el-input>
      </el-form-item>
    </el-form>
    <el-button style="background-color:#fd804c;color: #fff;" @click="isShow"
      >点击查询</el-button
    >

    <el-dialog title="背调详情" :visible.sync="dialogVisible" width="30%">
      <div class="everyitem">
        <div class="itemspaceBetween" style="margin-top:-40px">
          <div>征信记录：</div>
          <div>{{ backToneObj.creditRecords }}</div>
        </div>
        <div class="itemspaceBetween">
          <div>违法犯罪：</div>
          <div>{{ backToneObj.crime }}</div>
        </div>
        <div class="itemspaceBetween">
          <div>法律纠纷：</div>
          <div>{{ backToneObj.lawDispute }}</div>
        </div>
        <div class="itemspaceBetween">
          <div>背调结果：</div>
          <div>{{ backToneObj.backToneResult }}</div>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      dialogVisible: false,
      backToneObj: {
        creditRecords: "",
        crime: "",
        lawDispute: "",
        backToneResult: ""
      },
      ruleForm: {
        realName: "",
        idCordNo: ""
      }
    };
  },
  methods: {
    isShow() {
      if (this.ruleForm.realName == "" && this.ruleForm.idCordNo == "") {
        this.$message.error("员工被调信息未完整，请先填写!");
      } else {
        this.dialogVisible = true;

        this.getBackTone();
      }
    },
    getBackTone() {
      //console.log(`this.ruleForm.realName `, this.ruleForm.realName);
      //console.log(`this.ruleForm.idCordNo `, this.ruleForm.idCordNo);

      // 调用被调
      this.$http({
        url: "/staffadmin/homeService/staffManager/getBackTone",
        method: "POST",
        data: {
          name: this.ruleForm.realName,
          cid: this.ruleForm.idCordNo
        }
      }).then(res => {
        if (res.success == 1) {
          this.backToneObj = res.data;
        } else {
          this.$message.error(res.errorMsg);
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.itemspaceBetween {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
}
.everyitem {
  padding: 20px 0;
}
.item {
  border-top: 1px solid #e8e8e8;
}
.searchBack {
  background-color: #fff;
  border-bottom: 10px solid #ebeef1;
  padding-bottom: 20px;
  .tip {
    font-size: 18px;
    font-weight: 900;
    padding-left: 10px;
    height: 60px;
    line-height: 60px;
  }
}
/deep/ .el-form-item__content {
  height: 30px;
  width: 300px;
  .el-date-editor {
    height: 30px;
    width: 300px;
    .el-input__inner {
      height: 30px;
    }
  }
}
.name,
.idNo {
  margin-bottom: 12px;
}
/deep/ .el-button {
  margin-left: 140px;
}
</style>
